import { Button } from "antd-mobile";
import React from "react";
import { useNavigate } from "react-router-dom";
import { NavBar,Card } from "antd-mobile";
import { ResultPage } from "antd-mobile";
import { AlipayCircleFill } from 'antd-mobile-icons'
import "./index.css"
function Index() {
  const navigate = useNavigate();
  const details = [
    {
      label: "肯德基（嘉里中心店）",
      value: "¥ 36.50",
      bold: true,
    },
    {
      label: "付款方式",
      value: "账户余额",
    },
  ];
  return (
    <div>
      <NavBar onBack={()=>navigate("/")}></NavBar>

      <ResultPage
        status="waiting"
        title={<div style={{ fontSize: 15 }}>订单完成</div>}
        description={
        
            <span style={{ fontSize: 32, color: "#ffffff", marginRight: 4 }}>
              ¥
            </span>
         
        }
        icon={<AlipayCircleFill />}
        details={details}
      >
        {/* // 16.订单支付成功后，跳转到支付成功页，二次封装antd-mobile的按钮组件，实现页面中的两个按钮 */}
        <Card style={{ height: 64 }}>
          <div className="btn1" onClick={()=>navigate("/props")}>
            查看票
          </div>
          <div className="btn2">
            发现更多活动
          </div>
        </Card>
      </ResultPage>
    </div>
  );
}

export default Index;
